<template>
  <ych-modal
    :fullscreen="false"
    :visible="visible"
    @ok="handleOk"
    @cancel="handleCancel"
    :cancelText="$t('m.common.button.close')">

<!--    <ych-code-editor-->
<!--      v-model="script"-->
<!--      language="javascript"-->
<!--      :fullScreen="true"-->
<!--      :show-save="!!helpCode"-->
<!--      @save="() => $refs.help.save(helpCode, script)"-->
<!--      :placeholder="$t('m.common.tip.enter_script')"-->
<!--      :max-height="true"-->
<!--      style="min-height: 100px"/>-->
    <ych-script-editor v-model="script" language="javascript" :show-save="!!helpCode" @save="() => $refs.help.save(helpCode, script)"></ych-script-editor>
    <template slot="title">
      <span>{{ title }}</span>
      <ych-help :helpCode="helpCode" style="padding-left: 8px;"></ych-help>
    </template>

    <ych-help-util ref="help"></ych-help-util>
  </ych-modal>
</template>

<script>

  import YchHelp from "../../../../components/ych/YchHelp";
  import YchHelpUtil from "../../../../components/ych/ych-helps/YchHelpUtil";
  import YchScriptEditor from "../../../../components/ych/YchScriptEditor";

  export default {
    name: 'ShowConditionDialog',
    components:{
      YchHelp,
      YchHelpUtil,
      YchScriptEditor,
    },
    props: {
      helpCode: String,
    },
    data () {
      return {
        title: this.$t('m.common.label.operate'),
        visible: false,
        script: null,
      }
    },
    methods: {
      open (script) {
        this.script = script
        this.visible = true
      },
      handleOk () {
        this.$emit('selectFinished', this.script)
        this.visible = false
      },
      handleCancel () {
        this.visible = false
      }
    }
  }
</script>
